const path = require('path');
    const HtmlWebpackPlugin = require('html-webpack-plugin');
    const port = 3000 + Math.floor(Math.random() * 1000);

    module.exports = {
      mode: 'development',
      entry: './src/index.jsx',
      output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: '/'
      },
      module: {
        rules: [
          {
            test: /.jsx?$/,
            exclude: /node_modules/,
            use: {
              loader: 'babel-loader',
              options: {
                presets: ['@babel/preset-react']
              }
            }
          },
          {
            test: /.css$/,
            use: ['style-loader', 'css-loader']
          }
        ]
      },
      resolve: {
        extensions: ['.js', '.jsx']
      },
      devServer: {
        port: port,
        static: {
          directory: path.join(__dirname, 'dist'),
        },
        historyApiFallback: true, // Important for single-page applications
        allowedHosts: ['all', '.alibaba-inc.com']
      },
      plugins: [
        new HtmlWebpackPlugin({
          template: './index.html',
          inject: 'body'
        })
      ]
    };
